<?php

use yii\helpers\Html;
?>
<style>
	#listitem {
		width: 360px;
		margin: 25px 15px;
		background: rgba(255, 255, 255, 0.65);
		box-shadow: 0 8px 20px 0 rgba(31, 38, 135, 0.37);
		backdrop-filter: blur(5.0px);
		-webkit-backdrop-filter: blur(5.0px);
		border-radius: 10px;
		border: 1px solid rgba(255, 255, 255, 0.18);
		padding: 10px;
	}

	#listitem:hover {
		transform: scale(1.1);
		transition: .5s;
		cursor: pointer;
	}

	#listitem a {
		color: black;
		text-decoration: none;
	}

	#listitem .title p {
		font-size: 20px;
		text-align: center;
	}

	.icon {
		position: relative;
		top: 3px;
		width: 20px;
		height: 20px;
	}

	#listitem .content {
		line-height: 24px;
		overflow: hidden;
		height: 150px;
	}
</style>

<div class="post" id="listitem">
	<div class="title">
		<p><a href="<?= $model->url; ?>"><?= Html::encode($model->title); ?></a></p>

		<div class="author">
			<svg t="1624860607164" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1249" width="200" height="200">
				<path d="M512.099991 512m-344.244706 0a344.244706 344.244706 0 1 0 688.489411 0 344.244706 344.244706 0 1 0-688.489411 0Z" fill="#FFC824" p-id="1250"></path>
				<path d="M512.099991 1024A512 512 0 0 1 44.071755 304.188235a30.117647 30.117647 0 0 1 39.755294-15.36 30.117647 30.117647 0 0 1 15.36 39.755294A445.741176 445.741176 0 0 0 60.335285 512 451.764706 451.764706 0 1 0 399.459991 74.390588a30.117647 30.117647 0 1 1-15.058824-58.428235A520.432941 520.432941 0 0 1 512.099991 0a512 512 0 0 1 0 1024z" fill="#6B400D" p-id="1251"></path>
				<path d="M512.099991 244.856471a30.117647 30.117647 0 0 1-30.117647-30.117647V167.755294a30.117647 30.117647 0 0 1 60.235294 0v46.98353a30.117647 30.117647 0 0 1-30.117647 30.117647zM214.838814 542.117647H167.855285a30.117647 30.117647 0 0 1 0-60.235294h46.983529a30.117647 30.117647 0 1 1 0 60.235294zM512.099991 886.362353a30.117647 30.117647 0 0 1-30.117647-30.117647v-46.98353a30.117647 30.117647 0 0 1 60.235294 0v46.98353a30.117647 30.117647 0 0 1-30.117647 30.117647zM856.344696 542.117647h-46.983529a30.117647 30.117647 0 0 1 0-60.235294h46.983529a30.117647 30.117647 0 0 1 0 60.235294zM736.476461 669.515294a34.032941 34.032941 0 0 1-15.058823-3.915294l-224.075294-127.397647a30.117647 30.117647 0 0 1-14.155295-17.769412l-46.983529-162.635294a30.117647 30.117647 0 0 1 57.825882-16.564706l43.670589 150.588235 213.534117 120.470589a30.117647 30.117647 0 0 1 11.444706 40.96 30.117647 30.117647 0 0 1-26.202353 16.263529zM207.911755 168.357647a30.117647 30.117647 0 0 1-18.974117-53.609412c9.336471-7.529412 18.672941-14.456471 28.310588-21.383529a30.117647 30.117647 0 0 1 34.635294 49.091765c-8.432941 6.023529-16.865882 12.348235-24.997647 18.974117a30.117647 30.117647 0 0 1-18.974118 6.927059z" fill="#6B400D" p-id="1252"></path>
			</svg>&nbsp;<em><?= date('Y-m-d H:i:s', $model->create_time) . "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"; ?></em>
			<svg t="1624860728821" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1531" width="200" height="200">
				<path d="M789.504 890.368H319.488c-18.432 0-33.28 14.848-33.28 33.28s14.848 33.28 33.28 33.28h470.016c18.432 0 33.28-14.848 33.28-33.28s-14.848-33.28-33.28-33.28z" fill="#FA7268" p-id="1532"></path>
				<path d="M731.648 392.192c68.096-118.272 79.36-283.136 79.872-289.792 1.024-12.288-5.632-24.576-16.384-30.72-10.752-6.144-24.064-6.144-34.816 0.512-24.576 15.872-241.152 156.16-287.744 235.52-68.096 114.688-235.52 420.864-237.056 423.936-1.536 2.56-2.048 5.12-3.072 7.68l-91.648 158.72c-9.216 15.872-3.584 36.352 12.288 45.568 5.12 3.072 10.752 4.608 16.384 4.608 11.264 0 22.528-6.144 28.672-16.896L291.84 769.536c58.368-39.936 371.2-258.048 439.808-377.344z m-201.728-51.2c23.04-39.424 122.368-115.2 206.336-173.056-9.216 54.272-27.648 130.56-61.952 190.976-39.936 68.608-190.976 189.952-310.272 278.016 54.272-98.816 126.464-229.376 165.888-295.936z" fill="#3E3A39" p-id="1533"></path>
			</svg><em><?= Html::encode($model->author->nickname); ?></em>
		</div>
	</div>

	<br>
	<div class="content">
		<?= $model->beginning; ?>
	</div>

	<br>
	<div class="nav">
		<svg t="1624860792347" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2393" width="200" height="200">
			<path d="M613 928.2c-19.5 0-37.2-6.8-50-19.6L117.8 463.4c-12.5-12.5-19.7-29.9-19.7-47.6V152.2c0-29.8 24.2-54.1 54.1-54.1h263.6c18 0 34.9 7 47.6 19.7L908.6 563c31.5 31.5 24.4 88.1-16.3 128.8L691.8 892.4c-17.9 17.9-40 30.1-62.2 34.3-5.6 1-11.2 1.5-16.6 1.5zM157.7 157.7v258c0 2 0.8 4.1 2.3 5.5l445.2 445.2c2.1 2.1 7.4 2.7 13.4 1.6 10.4-1.9 21.7-8.5 31.1-17.9l200.5-200.5c18.6-18.6 21.1-39.7 16.3-44.5L421.2 160c-1.5-1.5-3.4-2.3-5.5-2.3h-258z" fill="#FC592D" p-id="2394"></path>
			<path d="M296.6 352.7c-32.1 0-58.2-26.1-58.2-58.2s26.1-58.2 58.2-58.2 58.2 26.1 58.2 58.2-26.1 58.2-58.2 58.2z m0-85.2c-14.9 0-27.1 12.2-27.1 27.1s12.2 27.1 27.1 27.1 27.1-12.2 27.1-27.1c0-15-12.2-27.1-27.1-27.1z" fill="#FFCE00" p-id="2395"></path>
		</svg>
		<?= implode(', ', $model->tagLinks); ?>
		<br>
		<svg t="1624860865060" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3568" width="200" height="200">
			<path d="M617.124 221.773h216.33c46.153 77.632 34.733 47.996 34.733 102.145l1.222 300.283c0 54.147-2.021 76.737-43.955 104.179H486.277l-57.332 10.007-145.402 120.719 13.382-114.904 6.127-12.256c-54.148 0-74.232-47.471-74.232-101.619V319.824c0-54.148 43.879-98.051 98.051-98.051h290.253z" fill="#ffc824" p-id="3569"></path>
			<path d="M162.607 468.936c-13.537 0-24.513-10.964-24.513-24.514v-59.223c0-13.548 10.976-24.513 24.513-24.513s24.513 10.964 24.513 24.513v59.223c0 13.55-10.976 24.514-24.513 24.514z" fill="#ffc824" p-id="3570"></path>
			<path d="M283.543 883.619c-3.28 0-6.583-0.646-9.707-2.011a24.507 24.507 0 0 1-14.806-22.693l0.802-106.022c-67.207-0.456-121.738-55.25-121.738-122.565v-120.53c0-13.549 10.976-24.512 24.513-24.512s24.513 10.963 24.513 24.512v120.529c0 40.552 32.987 73.539 73.539 73.539h23.867a24.506 24.506 0 0 1 17.403 7.254 24.5 24.5 0 0 1 7.11 17.45l-0.55 72.725 94.652-90.631a24.542 24.542 0 0 1 16.949-6.798h347.176c40.553 0 73.539-32.987 73.539-73.539V319.824c0-40.551-32.986-73.539-73.539-73.539H260.658c-40.551 0-73.539 32.987-73.539 73.539 0 13.549-10.976 24.513-24.513 24.513s-24.513-10.963-24.513-24.513c0-67.578 54.986-122.564 122.564-122.564h506.605c67.578 0 122.565 54.986 122.565 122.564v310.503c0 67.579-54.987 122.565-122.565 122.565H429.926L300.492 876.821a24.52 24.52 0 0 1-16.949 6.798z" fill="#ffc824" p-id="3571"></path>
			<path d="M755.009 447.703h-484.32c-13.537 0-24.513-10.964-24.513-24.513 0-13.549 10.976-24.513 24.513-24.513h484.32c13.537 0 24.512 10.963 24.512 24.513 0 13.549-10.975 24.513-24.512 24.513zM640.607 562.894H270.665c-13.538 0-24.513-10.964-24.513-24.512 0-13.55 10.976-24.514 24.513-24.514h369.942c13.537 0 24.512 10.964 24.512 24.514 0 13.548-10.974 24.512-24.512 24.512z" fill="#ffc824" p-id="3572"></path>
		</svg>
		<?= Html::a("({$model->commentCount})", $model->url . '#comments') ?> | Last Update <?= date('Y-m-s H:i:s', $model->update_time); ?>
	</div>

</div>